<template>
     <div class="edu-page-warp">
        <el-card shadow="never">
            <div class="edu-page-title">填报权限管理</div>
            <el-form :model="submitForm" ref="submitForm" label-width="165px" label-suffix="：" :rules="rules" style="margin-top:20px">
                <el-row>
                    <el-form-item :label="$t('message.startTime')" prop="startTime">
                          <el-col :span="6">
                               <el-date-picker
                                v-model="submitForm.startTime"
                                type="datetime"
                                style="width:100%"
                                :placeholder="$t('message.all')"
                                value-format="yyyy-MM-dd HH:mm:ss"
                                >
                            </el-date-picker>
                          </el-col>
                      </el-form-item>
                </el-row>
                <el-row>
                    <el-form-item :label="$t('message.endTime')" prop="endTime">
                          <el-col :span="6">
                               <el-date-picker
                                v-model="submitForm.endTime"
                                type="datetime"
                                style="width:100%"
                                :placeholder="$t('message.all')"
                                value-format="yyyy-MM-dd HH:mm:ss"
                                >
                            </el-date-picker>
                          </el-col>
                      </el-form-item>
                </el-row>
                <el-row>
                    <el-form-item label="填报开关">
                          <el-col :span="6">
                            <el-switch
                                v-model="submitForm.isopen"                                
                                >
                            </el-switch>
                          </el-col>
                      </el-form-item>
                </el-row>
                <el-row>
                    <el-form-item label="志愿数量" >
                          <el-col :span="6">
                               <el-input-number :precision="0"  v-model="submitForm.choiceNumber" :min="1" :max="100" ></el-input-number>
                          </el-col>
                      </el-form-item>
                </el-row>
                <el-row>
                    <el-form-item label="学分成绩占比(%)" >
                          <el-col :span="6">
                               <el-input-number :precision="0" v-model="submitForm.scorePercent" :min="0" :max="100" ></el-input-number>
                          </el-col>
                      </el-form-item>
                </el-row>   
                <el-row>
                    <el-form-item label="学生公布综合成绩排名" > 
                        <div style="width:400px">
                            <el-upload
                                ref="upload"
                                :headers="{'X-Token': $store.state.session.sessionid}"
                                :data="{bucketname: 'face', folderpath: 'file'}"
                                :on-remove="handleFileRemove"
                                :on-success="handleUploadSuccess"
                                :file-list="informationFileList"
                                class="upload-demo"
                                action="/api/commonservice/obsfile/uploadfile"
                                multiple
                                :limit="1"
                                :on-preview="handleClick"
                                :on-exceed="handleExceed"
                            >
                                <el-button size="small" type="primary" icon="el-icon-upload">点击上传</el-button>
                            </el-upload>
                        </div>          
                 </el-form-item>
                </el-row>   
                 <el-row>
                    <el-form-item>
                          <el-col :span="6">
                               <el-button @click="reset">{{$t('message.reset')}}</el-button>
                               <el-button type="primary" @click="save">{{$t('message.save')}}</el-button>
                          </el-col>
                      </el-form-item>
                </el-row>
            </el-form>
        </el-card>       
     </div>
</template>
<script>
import * as APIs from "common/src/api/preparatoryGraduation/enroll"
   export default {
    name: "recruitPermission",
    data() {
        return {
            submitForm:{
                id:null,
                startTime:null,
                endTime:null,
                isopen:true,
                choiceNumber:3,
                scorePercent:0,
                file:null
            },
            rules:{
                startTime:[{
                    required: true,
                    message: this.$t('message.plzSelect'),
                    trigger: "change"
                }],
                endTime:[{
                    required: true,
                    message: this.$t('message.plzSelect'),
                    trigger: "change"
                },
                { 
                    required: true, 
                    validator: this.validateRange, 
                    trigger: 'change' 
                }]
            },
            resetForm:null,
            informationFileList:[],
        }
    },
    mounted(){
        this.getConfig();
    },
    methods:{
        getConfig(){
            APIs.getAuthority().then(res=>{
                if(res.code==200){
                    if(res.data){
                        this.submitForm.id=res.data.id;
                        this.submitForm.startTime=res.data.startTime;
                        this.submitForm.endTime=res.data.endTime;
                        this.submitForm.choiceNumber=res.data.choiceNumber;
                        this.submitForm.isopen=res.data.isopen==1?true:false;
                        this.submitForm.scorePercent=res.data.scorePercent;
                        this.submitForm.file=res.data.file;
                        this.resetForm=res.data;
                        if(this.submitForm.file&&this.informationFileList.length==0){
                            this.informationFileList=[{name:'综合成绩排名',url:this.submitForm.file}];
                        }
                    }
                }
            })
        },
        save(){
            this.$refs.submitForm.validate(valid=>{
                if(valid){
                    let param=_.cloneDeep(this.submitForm)
                    param.isopen=param.isopen?1:0;
                    APIs.setAuthority(param).then(res=>{
                        if(res.code==200){
                            this.$message({
                                type: "success",
                                message: this.$t('message.saveSuccess')
                            });
                            this.getConfig();
                        }
                    })
                }
            })
        },
        reset(){
            if(this.resetForm){
                APIs.reSetAuthority(this.resetForm).then(res=>{
                    if(res.code==200){
                       this.setDefaultVal();
                    }
                });  
            }else{
                this.setDefaultVal();
            }   
        },
        setDefaultVal(){
            this.resetForm=null;
            this.submitForm.id=null;
            this.submitForm.startTime=null;
            this.submitForm.endTime=null;
            this.submitForm.choiceNumber=3;
            this.submitForm.isopen=true;
            this.submitForm.scorePercent=0;
            this.submitForm.file=null;
            this.$refs.upload.clearFiles();
            this.$nextTick(()=>{
                this.$refs.submitForm.clearValidate();
            })
        },
        validateRange(rule, value, callback){
            let startTime=new Date(this.submitForm.startTime)
            let endTime=new Date(this.submitForm.endTime)
            if(startTime>endTime){
                callback(new Error("开始时间不能超过结束时间"))
            }else{
                callback();
            }
        },
        handleFileRemove(file, fileList) {
            this.informationFileList = fileList
            this.submitForm.file=null;  
        },
        handleUploadSuccess(res, file, fileList) {  
            this.informationFileList = fileList;
            let name = file.name;
            this.submitForm.file=res.data[name].objectkey;      
        },
        handleClick(file){           
            let path=this.submitForm.file;
            if(path==null){
                let name=file.name;
                path=file.response.data[name].objectkey;
            }
            window.location.href = "/api/commonservice/obsfile/downloadfile?objectkey=" +path;
        },
        handleExceed(){
           this.$message.warning(`当前限制只能选择 1 个文件`);
        }
    }
   }
</script>